﻿@using Entity.ProjectEnt
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Index.cshtml";
    List<PathwayEntity> gudaolist = ViewBag.gudaolist as List<PathwayEntity>;

}
<script src="~/Content/js/datepicker/WdatePicker.js"></script>
<style>
    #gridList2 table tr td {
        padding-left: 15px;
    }
    #gridList2 table tbody tr td {
        height: 20px;
    }
    #gridList2 .form-control {
        display: block;
        width: 65px;
        height: 25px;
        font-size: 14px;
        font-weight:700;
        text-align: center;
        line-height: 1.42857;
        color: rgb(85, 85, 85);
        background-color: rgb(255, 255, 255);
        background-image: none;
        box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
        padding: 8px 10px;
        border-width: 1px;
        border-style: solid;
        border-color: rgb(221, 221, 221);
        border-image: initial;
        border-radius: 4px;
        transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    }
    
    #gridList1 tbody tr td {
        text-align: center;
    }
    .firstBox {
        width: 40%;
        float: left;
    }
    .secondBox {
        float: left;
        margin-right: 20px;
        width: 56%;
    }
    .thirdBox {
        margin-left: 18%;
        margin-bottom:18px;
        margin-top: 22px;
        width:100px;
    }
    .fourthBox {
        margin-left: 18%;
        margin-bottom: 18px;
        width: 400px;
        height: 25px;
    }
    .fifthBox {
        margin-left: 18%;
        margin-bottom: 18px;
        width: 470px;
        height: 25px;
    }
    .sddd {
        width: 130px;
        float: left;
        height: 20px;
        line-height: 1.42857;
        color: rgb(85, 85, 85);
        background-color: rgb(255, 255, 255);
        background-image: none;
        box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
        padding: 6px 12px;
        border-width: 1px;
        border-style: solid;
        border-color: rgb(221, 221, 221);
        border-image: initial;
        border-radius: 4px;
        transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    }
    .sddd1 {
        width: 130px;
        height: 20px;
        line-height: 1.42857;
        margin-left: 10px;
        color: rgb(85, 85, 85);
        background-color: rgb(255, 255, 255);
        background-image: none;
        box-shadow: rgba(0, 0, 0, 0.075) 0px 1px 1px inset;
        padding: 6px 12px;
        border-width: 1px;
        border-style: solid;
        border-color: rgb(221, 221, 221);
        border-image: initial;
        border-radius: 4px;
        transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    }
</style>
<div class="gridPanel">
    <div>
        <table id="gridList3" class="table table-bordered table-hover">
            <tr>
                <th style="text-align: center; width: 12%">股道名称</th>
                <th style="text-align: center; width: 10%">车辆</th>
                <th style="text-align: center; width: 77%">车辆详细</th>
            </tr>
        </table>
    </div>
   

    <div class="firstBox">
        <div style="width: 85px; float:left">
            <select class="form-control" id="gudaoselect" style="margin-left: 2px; margin-bottom: 12px; margin-top: 23px; width: auto; height: 20px;">
                @{
                    if (gudaolist != null && gudaolist.Count > 0)
                    {
                        foreach (var item in gudaolist)
                        {
                            <option value="@item.F_Id">@item.Name</option>
                        }
                    }
                }
            </select>
            @*<button type="button" class="btn btn-default" onclick="SelectGudaoCar()">查询股道车辆信息</button>*@
        </div>
        <div>
            <table id="gridList1" class="table table-bordered table-hover">
                <thead>
                <tr>
                    <th style="text-align: center">序号</th>
                    <th style="text-align: center">车号</th>
                    <th style="text-align: center">重量</th>
                    <th style="text-align: center">客户</th>
                    <th style="text-align: center">起票</th>
                    <th style="text-align: center">备注</th>
                </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
   
    <div class="secondBox">
        <div class="thirdBox">
            <button id="Submit" class="btn btn-success" onclick="SubmitPlay()">创建计划</button>
           
        </div>
        <div class="fourthBox">
            <span style="display: block; width: 120px; float: left; text-align: left;line-height: 35px">计划批次：</span>
            <input id="Planmun" name="F_ManagerId" type="text" class="sddd" style="float: left;margin-left: 10px"/>
        </div>
        <div class="fifthBox">
            <span style="display: block; width: 120px; float: left; text-align: left;line-height: 35px">计划开始/截止时间：</span>
            <input id="SendTime" name="SendTime" type="text" class="input-wdatepicker sddd1" onfocus="WdatePicker()"  placeholder="开始时间" />
            <input id="SendTime1" name="SendTime" type="text" class="input-wdatepicker sddd1" onfocus="WdatePicker()"  placeholder="截止时间" />
            @*<input id="F_WeChat3" name="F_ManagerId" type="text" class="sddd1" />*@
            @*<input id="F_WeChat1" name="F_ManagerId" type="text" class="sddd1" />*@
        </div>
        <div style="float: left; margin-left: 18%">
           
            @*<div style="margin-bottom: 15px;">
                <span>计划批次：</span>
               
            </div>*@
            <table id="gridList2" class="table table-bordered table-hover" style="width: 40%; max-width: 40%; float: left;">
                <thead>
                    <tr>
                        <th style="text-align: center">方向</th>
                        <th style="text-align: center">股道</th>
                        <th style="text-align: center">方法</th>
                        <th style="text-align: center">车数</th>
                        <th style="text-align: center">记事</th>
                        <th style="text-align: center">操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            <select class="form-control fangxiang" style="width: 40px;">
                                <option value="西">西</option>
                                <option value="东">东</option>
                            </select>
                        </td>
                        <td>
                            <select class="form-control gudao"></select>
                        </td>
                        <td>
                            <select class="form-control fangfa" style="width: 30px;">
                                <option value="+">+</option>
                                <option value="-">-</option>
                            </select>
                        </td>
                        <td>
                            <input type="text" class="form-control cheshu" value="0" style="width: 30px;">
                        </td>
                        <td>
                            <input type="text" class="form-control jishi" value="" style="width: 115px">
                        </td>
                        <td>
                            <input type="button" class="form-control addnewlen" value="添加一行" />
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>  
</div>

<script>

    var gudaolist = '@ViewBag.gudaolists';
    var listobj;
    var optionstr = '';
    var newJYDDIndex = 1;
    $(function() {
        SelectGudaoCar();
        var reg = new RegExp('&quot;', "g")
        gudaolist = gudaolist.replace(reg, "\"");
        listobj = JSON.parse(gudaolist);
        $.each(listobj,
            function(i) {
                optionstr += "<option value='" + listobj[i].Name + "'>" + listobj[i].Name + "</option>";

            });
        $(".gudao").append(optionstr);
        $(".addnewlen").click(function() {
            newJYDDIndex += 1;
            $("#gridList2 tbody").append(
                '<tr><td>  <select class="form-control fangxiang" style="width:40px;"> <option value="西">西</option>  <option value="东">东</option> </select> </td> <td> <select class="form-control gudao"> ' +
                optionstr +
                '</select> </td>  <td> <select class="form-control fangfa" style="width:30px;">  <option value="+">+</option> <option value="-">-</option> </select>  </td>  <td> <input type="text" class="form-control cheshu" value="0" style="width:30px;">  </td> <td>  <input type="text" class="form-control jishi" value="" style="width:115px"> </td><td> <input type="button" class="form-control" value="删除当前行"  onclick=\'deleteTr(this);\' /> </td></tr>');
        });

        $("#gudaoselect").change(function() {
            SelectGudaoCar();
        });
    });

    function addNewLine() {
        newJYDDIndex += 1;
        $("#gridList2 tbody").append(
            '<tr><td>  <select class="form-control fangxiang" style="width:40px;"> <option value="西">西</option>  <option value="东">东</option> </select> </td> <td> <select class="form-control gudao"> ' +
            optionstr +
            '</select> </td>  <td> <select class="form-control fangfa" style="width:30px;">  <option value="+">+</option> <option value="-">-</option> </select>  </td>  <td> <input type="text" class="form-control cheshu" value="0" style="width:30px;">  </td> <td>  <input type="text" class="form-control jishi" value="" style="width:115px"> </td><td> <input type="button" class="form-control" value="删除当前行"  onclick=\'deleteTr(this);\' /> </td></tr>');
    }
    $(function() {
        $.ajax({
            url: '/Project/Pathway/GetGridJsonAuto',
            data: {},
            dataType: "json",
            type: "Get",
            success:function(data) {
                if (data != "") {
                    var str = '';
                    $.each(data.rows,
                        function(i, val) {
                            str += '<tr>';
                            str += '<td  style="text-align:center">' + val.gudao + '</td>';
                            str += '<td  style="text-align:center"> ' + val.CarNumber + '</td>';
                            str += '<td  style="text-align:center">' + val.xingxi + '</td>';
                            str += '</tr>';
                        });
                    $('#gridList3 tbody').append(str);
                }
            }

        });
        //$(".gudao").change(function() {
           
        //});
        //$(".gudao").bind("change",function(){
        //    alert("111");
        //});
    });
    $("#gridList2").on("change", ".gudao", function () {
        var gudaoname = $(this).val();
        var gudaoid='';
        $("#gudaoselect option").each(function () {
            //alert($(this).text() + ",gudaoname:" + gudaoname);
            if ($(this).text() == gudaoname){
                //$(this).attr("selected", true);
                gudaoid = $(this).val();
                SelectGudaoCarnews(gudaoid);
                //alert($(this).text() + ",gudaoname:" + gudaoname);
                return;
            } 
        });    
     
    });
    function SelectGudaoCarnews(gudaonames) {
    $("#gudaoselect").val(gudaonames);
        var gudaoid = gudaonames;
        $.ajax({
            url: '/Project/WorkPlan/GetGudaocar',
            data: { gudaoid: gudaoid },
            dataType: "json",
            type: "Get",
            async:true, 
            success: function (data) {
                //console.log(data);
                if (data != '') {
                    var dataobj = JSON.parse(data);
                    var index = 1;
                    var appendlist = '';
                    //console.log(dataobj);
                    $.each(dataobj,
                        function (i, val) {
                            appendlist += '<tr>';
                            appendlist += '<td>' + index + ' </td>';
                            appendlist += '<td> ' + val.BelongCarriage.CarriageID + '</td>';
                            appendlist += '<td> ' + val.Weight + '</td>';
                            appendlist += '<td> ' + val.Customers + '</td>';
                            appendlist += '<td>' +
                                (val.isQiPiao == true
                                    ? "<div style=\"color: lawngreen\">已起票</div>"
                                    : "<div style=\"color: red\">未起票</div>") +
                                ' </td>';
                            appendlist += '<td>' + val.Remark + ' </td>';
                            appendlist += '</tr>';
                            index = index + 1;
                        });
                    $("#gridList1 tbody").empty();
                    $("#gridList1 tbody").append(appendlist);
                } else {
                    $("#gridList1 tbody").empty();
                    //$("#gridList1 tbody").append('股道中无车辆信息');
                }

            }
        });
    }
    function SelectGudaoCar() {
        //alert();
        var gudaoid = $("#gudaoselect").val();
        $.ajax({
            url: '/Project/WorkPlan/GetGudaocar',
            data: { gudaoid: gudaoid },
            dataType: "json",
            type: "Get",
            success: function(data) {
                //console.log(data);
                if (data != '') {
                    var dataobj = JSON.parse(data);
                    var index = 1;
                    var appendlist = '';
                    //console.log(dataobj);
                    $.each(dataobj,
                        function(i, val) {
                            appendlist += '<tr>';
                            appendlist += '<td>' + index + ' </td>';
                            appendlist += '<td> ' + val.BelongCarriage.CarriageID + '</td>';
                            appendlist += '<td> ' + val.Weight + '</td>';
                            appendlist += '<td> ' + val.Customers + '</td>';
                            appendlist += '<td>' +
                                (val.isQiPiao == true
                                    ? "<div style=\"color: lawngreen\">已起票</div>"
                                    : "<div style=\"color: red\">未起票</div>") +
                                ' </td>';
                            appendlist += '<td>' + val.Remark + ' </td>';
                            appendlist += '</tr>';
                            index = index + 1;
                        });
                    $("#gridList1 tbody").empty();
                    $("#gridList1 tbody").append(appendlist);
                } else {
                    $("#gridList1 tbody").empty();
                    //$("#gridList1 tbody").append('股道中无车辆信息');
                }

            }
        });
    }

    function deleteTr(nowTr) {
        $(nowTr).parent().parent().remove();
        newJYDDIndex = newJYDDIndex - 1;
    }

    function SubmitPlay() {
        $("#Submit").attr({ "disabled": "disabled" });
        var arr = [];
        var trs = $("#gridList2 tbody tr");
        if (trs.length <= 0) {
            top.alert("请添加数据", function (i) {
                top.close(i);
            }); 
            return false;
        }
        var flag = 0;
        trs.each(function() {
            var obj = {};
            obj.fangxiang = $.trim($(this).find(".fangxiang").val());
            obj.gudao = $.trim($(this).find(".gudao").val());
            obj.fangfa = $.trim($(this).find(".fangfa").val());
            obj.cheshu = $.trim($(this).find(".cheshu").val());
            obj.jishi = $.trim($(this).find(".jishi").val());
            if (!$.trim(obj.fangxiang) || !$.trim(obj.gudao) || !$.trim(obj.fangfa) || !$.trim(obj.cheshu)) {
                flag = 2;
                return false;
            }
            arr.push(obj);
        });
        debugger;
        switch (flag) {
        case 2:
            top.alert("传入数据为空", function (i) {
                top.close(i);
            });
            return false;
            break;
        }
        //console.log(arr);
        debugger;
        $.ajax({
            url: '/Project/WorkPlan/AddCarTrunToPlan',
            data: { jsonData: JSON.stringify(arr), Planmun: $("#Planmun").val(), SendTime: $("#SendTime").val(), SendTime1: $("#SendTime1").val() },
            dataType: "text",
            type: "POST",
            success: function (data) {
                //alert(data);
                var dataobj = JSON.parse(data);
                if (dataobj.code == 0) {
                    top.alert("添加成功", function (i) {
                    });
                }
                else {
                    top.alert(dataobj.msg, function (i) {
                        layer.close(i);
                    });
                }
                $("#Submit").removeAttr("disabled");
                $("#gridList2 tbody").empty();
                newJYDDIndex = 1;
                $("#gridList2 tbody").append(
                    '<tr><td>  <select class="form-control fangxiang" style="width:40px;"> <option value="西">西</option>  <option value="东">东</option> </select> </td> <td> <select class="form-control gudao"> ' +
                    optionstr +
                    '</select> </td>  <td> <select class="form-control fangfa" style="width:30px;">  <option value="+">+</option> <option value="-">-</option> </select>  </td>  <td> <input type="text" class="form-control cheshu" value="0" style="width:30px;">  </td> <td>  <input type="text" class="form-control jishi" value="" style="width:115px"> </td><td> <input type="button" class="form-control addnewlen" value="添加一行" onclick=\'addNewLine()\' /> </td></tr>');

            }
        });
    }
</script>


